import { login, getUserInfo, getUserDetailById } from '@/api/user' // 导入登录接口
import { getToken, setToken, removeToken, setTimeStamp } from '@/utils/auth'
import { resetRouter } from '@/router'
export default {
  // 开启命名空间
  namespaced: true,
  // 放数据的地方
  state: {
    token: getToken() || null,
    userInfo: {} // 定义一个空的对象 不是null 因为后边我要开发userInfo的属性给别人用  userInfo.name
  },
  // 相当于组件中计算属性
  getters: {},
  // 这个是唯一修改state中数据地方
  mutations: {
    // 设置token
    setToken(state, token) {
      state.token = token // 设置token  只是修改state的数据  123 =》 1234
      // vuex变化 => 缓存数据
      setToken(token) // vuex和 缓存数据的同步
    },
    // // 删除缓存
    removeToken(state) {
      state.token = null // 删除vuex的token
      removeToken() // 先清除 vuex  再清除缓存 vuex和 缓存数据的同步
    },
    // 设置用户信息
    setUserInfo(state, userInfo) {
      state.userInfo = { ...userInfo } // 用 浅拷贝的方式去赋值对象 因为这样数据更新之后，才会触发组件的更新
    },
    // 删除用户信息
    removeUserInfo(state) {
      state.userInfo = {}
    }
  },
  // 写异步的ajax的地方
  actions: {
    // 登录存储 用户的token
    async login(store, payload) {
      const res = await login(payload)
      store.commit('setToken', res)
      setTimeStamp()
    },

    // 获取用户资料action
    async getUserInfo(context) {
      const result = await getUserInfo()// 获取返回值
      const baseInfo = await getUserDetailById(result.userId)
      context.commit('setUserInfo', { ...result, ...baseInfo }) // 将整个的个人信息设置到用户的vuex数据中
      return result // 这里为什么要返回 为后面埋下伏笔
    },

    // 删除用户信息并退出
    logout({ commit }) {
      // 删除token
      commit('removeToken')
      // 删除用户信息
      commit('removeUserInfo')
      // 重置路由
      resetRouter()
      // 还有一步  vuex中的数据是不是还在
      // 要清空permission模块下的state数据
      // vuex中 user子模块  permission子模块
      // 子模块调用子模块的action  默认情况下 子模块的context是子模块的
      // 父模块 调用 子模块的action
      commit('permission/setRoutes', [], { root: true })
      // 子模块调用子模块的action 可以 将 commit的第三个参数 设置成  { root: true } 就表示当前的context不是子模块了 而是父模块
    }
  }
}
